<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../lib/layui-v2.5.5/css/layui.css" media="all">
  <link rel="stylesheet" href="../css/public.css" media="all">
</head>

<body class="class1">
<div style="width: 100%;" id="refreshs">
  <div class="layui-tab"  lay-filter="test">
    <div class="layuimini-container">
      <div class="layuimini-main">
        <script type="text/html" id="toolbarDemo">
          <div class="layui-btn-container">
            <span class="layui-card-header"><i class="layui-icon layui-icon-form"></i>&nbsp;待办任务列表</span>
          </div>
        </script>

        <table class="layui-hide" id="ToDoTasksTableId" lay-filter="currentTableFilter"></table>
        <!--分页-->
        <div class="layui-table-page layui-border-box">
          <div id="barcon" class="page_div" name="barcon"></div>
        </div>

        <script type="text/html" id="currentTableBar">
          <a class="layui-btn layui-btn-xs layui-btn-danger data-count-handle" lay-event="handle">办理</a>
        </script>

      </div>

    </div>
  </div>
</div>
  <script src="../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
  <script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
  <script src="../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
  <script src="../js/ManualPaging.js"></script>
  <script>
    if (!localStorage.getItem("userName")) {
      window.location = './login-1.html';
    }
    layui.use(['form', 'table', 'miniTab', 'element','layer'], function() {
      console.log('++++++++++')
      console.log(111)
      console.log('++++++++++')
      var jt = 1;
      var $ = layui.jquery,
        form = layui.form,
        table = layui.table,
        miniTab = layui.miniTab,
      element = layui.element

      element.on('tab(test)', function(data) {
        console.log(this); //当前Tab标题所在的原始DOM元素
        console.log(data.index); //得到当前Tab的所在下标
        console.log(data.elem); //得到当前的Tab大容器
      });

      var insTb = table.render({
        elem: '#ToDoTasksTableId',
        toolbar: '#toolbarDemo',
        defaultToolbar: [''],
        url: '' + publicurl + 'task/getTasks',
        parseData: function(res) { //res 即为原始返回的数据
          // console.log(res)
          //处理时间
          for (var i = 0; i < res.obj.length; i++) {
            for (k in res.obj[i]) {
              res.obj[i]["createdDate"] = renderTime(res.obj[i].createdDate);
              res.obj[i]['status'] = judgeState(res.obj[i].status)
            }
          }
          return {
            "code": res.status, //解析接口状态,默认成功是0
            "msg": res.msg, //解析提示文本
            "count": res.obj.length, //解析数据长度
            "data": res.obj //解析数据列表
          };
        },
        cols: [
          [
            // { type: "checkbox", width: '5%', align: "center" },
            { field: 'id', width: '15%', title: 'ID', align: "center" ,hide:true},
            { field: 'processDefinitionName', width: '15%', title: '定义名称', align: "center" },
            { field: 'instanceName', width: '10%', title: '实例名称', align: "center" },
            { field: 'name', width: '20%', title: '任务节点名称', align: "center" },
            // { field: 'status', width: '5%', title: '任务状态', align: "center" },
            { field: 'assignee', width: '10%', title: '办理人', align: "center" },
            { field: 'comments', width: '25%', title: '驳回意见', align: "center" },
            { field: 'createdDate', title: '创建时间', width: '15%', align: "center" },
            { title: '操作', width: '5%', toolbar: '#currentTableBar', align: "center" }
          ]
        ],
        limits: [10, 15, 20, 25, 50, 100],
        limit: 10,
        page: false,
        skin: 'line',
        // id:'ToDoTasksTableId',
        done: function(res, curr, count) {
          if (res.code == 1) {
            layer.alert(res.msg + '<br>' + res.data, {
              icon: 2,
              title: "提示"
            },function(index) {
              location.href='login-1.html'
            });
          }

          if (count > 0) {
            goPage(1);
          }
        }
      });

      /**
       * toolbar监听事件
       */
      table.on('tool(currentTableFilter)', function(obj) {
        jt=3;
        if (obj.event === 'handle') { // 监听办理操作
          // 返回跳转地址 TODO
          $.ajax({
            url: publicurl + 'pro/queryPageIndexByTaskID',
            type: 'GET',
            data: {
              taskID: obj.data.id
            },
            dataType: 'text',
            success: function(result) {
              // TODO 后端返回字符串或对象不一定
              if (Object.prototype.toString.call(result) == "[object String]") {
                result = JSON.parse(result)
              }

              //表单初始赋值
              miniTab.openNewTabByIframe({
                href: "page/step" + result.obj.id + ".html?id=" + obj.data.id + "&name=" + obj.data.name + '&type=1',
                title: result.obj.name || '起草提报',
              });
            },
            error: function(err) {
              console.log(err)
            }
          });
          // console.log(obj);
          // creatFormTable(obj);
        }
      });
      //刷新
      $(".class1").hover(function (e) {
       // console.log(window.location.href)
       // var router = layui.router();
        //console.log(router);
        //$("#refreshs").css("padding","0 0 100px 0");
        $("#refreshs").height($(window).height()-40)
       let TBaoIDa = localStorage.getItem("TBaoID");
        if(TBaoIDa==1){
          //$("#refreshs").height($(window).height()-30)
          //$("#refreshs").css("padding","0 0 100 0");
          console.log('鼠标移入');
          localStorage.setItem("TBaoID", 0);
          window.location.reload()
        }
      });
      function renderTime(date) {
        var dateee = new Date(date).toJSON();
        return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
      }

      function judgeState(state) {
        var stateText = '';
        if (state == 'ASSIGNED') {
          stateText = '执行中';
        } else {
          stateText = state
        }
        return stateText
      }
      //监听表格复选框选择
      table.on('checkbox(currentTableFilter)', function(obj) {
        console.log(obj)
      });
      //动态生成表单
      function creatFormTable(obj) {
        var loadIndex = layer.load(2);
        $.get('' + publicurl + 'task/formDataShow', {
          taskID: obj.data ? obj.data.id : '',
        }, function(res) {
          layer.close(loadIndex);
          if (res.obj != '无表单' && res.status == 0) {
            var index = layer.open({
              title: '办理任务',
              type: 2,
              shade: 0.2,
              maxmin: true,
              shadeClose: true,
              area: ['100%', '100%'],
              content: '../page/table/FormDataShow.html',
              success: function(layero, index) {
                var iframe = window['layui-layer-iframe' + index];
                iframe.child(JSON.stringify(res.obj), obj.data.id)
                localStorage.setItem("ID", obj.data.id);
              },
              end: function() {
                insTb.reload();
              }
            });
            $(window).on("resize", function() {
              layer.full(index);
            });
          } else if (res.status == 1) {
            parent.layer.msg(res.obj, {
              icon: 0,
              time: 2000
            });
          } else {
            doHandle(obj);
          }
        }, 'json');

      }
      /* 挂起流程定义 */
      function doHandle(obj) {
        console.log(obj, "单条数据");
        layer.confirm('确定要办理该任务吗？', {
          skin: 'layui-layer-admin',
          shade: .1
        }, function(i) {
          layer.close(i);
          var loadIndex = layer.load(2);
          $.get('' + publicurl + 'task/completeTask', {
            taskID: obj.data ? obj.data.id : '',
          }, function(res) {
            layer.close(loadIndex);
            if (res.status === 0) {
              layer.msg(res.msg, { icon: 1 });
              insTb.reload();
            } else {
              layer.alert(res.msg + '<br>' + res.obj, { icon: 2 });
            }
          }, 'json');
        });
      };

    });
  </script>

</body>

</html>